Web application is not loading after redeployment - javascript

I have the following situation:
I have a react web application that is deployed on an NGINX web server via Jenkins. In some cases, my web application does not show up in the browser after I deployed a new version of the application. When you open the web application, it only shows a text: "Loading...".
A quick solution to this problem is to delete your browser data and refresh the web application.
My question: What is the possible cause for this problem or how can I find out what the cause is? I don't want that the users of this application have to delete their browser data when I deploy a new version.

From my experience, It could be because of several reasons:
1) The javascript could be breaking.
2) You might be using some caching strategy that causes the javascript to be cached. Service worker for example.
3) Problem with your react router configuration.
4) A network call might be taking too long to respond.
Need a minimum reproducible example to debug further.

Related

Issues webview Android application

I make a web application using quasar and java spring boot backend. I convet my web application to an Android application using webview. But when i published in play store, its gives security issue for my backend server url. But i do not collect any data or install anything in Android apps or user device but Google gives an exception in my Android App. How can i fix this issue in Android web-view apps.
This warning is sent by Google Safe Browsing service, which is embedded in the Google Chrome Browser and several other browsers, this service looks for vulnerabilities principally in the markup; for example open tags that could lead to a code injection or other possible threats. The Safe browsing service is independent of the GCP Serverless services, this means that GCP is not marking the site as dangerous.
To prevent this message from appearing, or remove it we can do the following:
Look out for potential vulnerabilities in the app, once the changes have been made, you can use this page to see the Safe Browsing Status.
If you think that there was a mistake, you can request a review to remove the Phishing Warning in this site.
It is highly recommended to take a look a this documentation to understand what could be the reason behind the message
My issue is now fixed. It ended up being a hosting server issue. Google had me on a black list, but now its fixed.

Problem run Flutter Web app in our company network

I'm trying to run my Flutter Web app on Local Area Network (intranet) in my work. But there is no internet access. And I have this issue “ Failed to load resource: net :: ERR_INTERNET_DISCONNECTED “. I think, problem is with canvaskit.js because my app try to download from internet. Do you have some idea how to fix it?
This is a common mistake when you use Flutter web within an Intranet that has no Internet access. I will try to explain it in detail.
In Flutter Web you can choose between two web renderers (more info here). The default one is CanvasKit, but there is also the HTML renderer.
The problem with CanvasKit web renderer is that when you start the application for the first time, it goes to unpkg.com and downloads two files: canvaskit.js and canvskit.wasm. Once downloaded, the browser caches them and Flutter doesn't need to download them again in the future.
But, if the app can't download these files, the application fails to start. Which is the problem that #TomášTorok mentions.
What are the solutions? There are two possibilities:
1 - Force your app to use the HTML web renderer, as it doesn't need to download anything over the Internet. This web renderer has some limitations that CanvasKit doesn't have, and vice versa (in this article they explain everything in detail)
To use the HTML in debug:
flutter run -d chrome --web-renderer html
OR if you want to build your app:
flutter build web --web-renderer html
2 - Download manually the canvaskit.js and canvaskit.wasm files from unpkg.com (example link), add them inside your project (inside /web folder), and force Flutter web to grab the local files and not download anything from the Internet.
It's a bit more work, but it's not complex either. You have the instructions in this link.
If I understood correctly;
There is nothing to do with flutter version or flutter channel. The error message is clearly explaining that internet is disconnected. The universal truth is you need a minimum speed internet to debug or release your flutter code development. Try to check the internet connection.
Reply back if this answer is helpful to you, also share how did you solved the issue.

How do you push Application updates on an installed PWA application?

My question is, Is it possible for the Users to acquire these changes without having to REINSTALL the PWA application?
I have a PWA application deployed in Production. The client already installed the deployed PWA application in their MOBILE devices and I want to DEPLOY another patch of updates in the PWA application in the HTTP server.
Another simple way to update application is using workbox-window. You can detect updates in PWA and restart your application to get the last updates. For more detail, I suggest you read this link
I would suggest to read this link explaining in detail how the SW Updates work.
Long story short, if you deploy a new app version, the new SW will be installed on the client's side (using a separate/dedicated install event) and then activated when the users navigates to an URL different from the PWA one.
There is also a built in service workers feature called "fail safe". Within at most 24H the SW checks if a newer version is available and, if so, attempts to update to it.
I wrote a PWA series and here a post about Service Workers and caching strategies if you want to read more.

React Native JS concern

I am new to react-native world. Following few tutorials, I found that it react-native app runs on javascript engine on mobile. I am following ios tutorial. So when I go to localhost:8081/index.ios.bundle it loads JS for the app. I know I can use ngrok to manipulate this URL.
I have multiple concerns with this:-
If I change the URL of js from something local to something remote, this would result in a completely new app and now I don't need to go through the App Store to upgrade my app version. Can this be a potential issue in the future?
Since anybody can open this JS in a browser which might have important information like client id and secret for the app, can this be an issue as well?
I am not 100% sure. You can indeed update hybrid app easier and if it is only a quick fix you don't need to go through apple store verification process. Apple can also delete your app and ban you if you don't follow guidelines. Usually your js is local in production for instant app start time, and the network is used only for fresh data.
This is solved with an authentication mechanism.

How to run a script from the Web in a Windows 8 app?

My organization already developed iOS and Android apps, and is starting to develop an app for Windows 8. In case it matters, the app is using Phonegap a.k.a. Cordova.
On the existing apps, the user downloads a very "slim" app from the store, containing a minimal HTML page. The user logs into a server, and then script tags are dynamically added pointing to locations on that server. Similar to web apps, scripts are downloaded to the client and then executed.
Windows 8's new security model blocks this behavior. Since the app runs in the local context and the script is on the web, I get the error "An app can’t load remote web content in the local context."
Is there a way to get around this restriction?
I'm open to "creative" suggestions and hacks, up to a point. I've already tried a few things, such as fetching a script with plain XHR calls and then injecting the response to a pre-defined script tag. Windows blocked this and all other attempts.
I also considered rendering everything in an iframe with a "ms-appx-web:" scheme (learned about this scheme here, "Schemas and contexts" section). This might allow me to load remote scripts, but would prevent code from accessing APIs of the locally-running JavaScript code -- Cordova and Windows Runtime. This access is necessary for my app. If there's a way to access Cordova and Windows Runtime from the web context, that might be useful too.
I very much doubt it.
The whole point of the MS Windows Store certification model is that they can test your code for malware/ crashes. If you can change the code on the fly, you could ship a perfectly harmless app, have it certified by MS, and then change it to something dreadful after the user installs it.

Categories

Resources