Failed to execute 'replaceState' on 'History - node.js

I'm sending an exported file of codelab from the server-side to the client-side (React) where I embed it in the iframe. Interface showing correctly but I'm getting these errors in the console
Failed to execute 'replaceState' on 'History
Uncaught DOMException: Failed to execute 'replaceState' on 'History': A history state object with URL 'http://localhost:3000/#3' cannot be created in a document with origin 'http://localhost:3000' and URL 'about:srcdoc'.
at W.ca (https://storage.googleapis.com/codelab-elements/codelab-elements.js:254:283)
at Sc (https://storage.googleapis.com/codelab-elements/codelab-elements.js:260:26)
at W.attributeChangedCallback (https://storage.googleapis.com/codelab-elements/codelab-elements.js:249:320)
at Qc (https://storage.googleapis.com/codelab-elements/codelab-elements.js:264:156)
at W.connectedCallback (https://storage.googleapis.com/codelab-elements/codelab-elements.js:247:50)
at W.attributeChangedCallback (https://storage.googleapis.com/codelab-elements/codelab-elements.js:249:152)
at CustomElementRegistry.define (https://storage.googleapis.com/codelab-elements/native-shim.js:150:18)
at https://storage.googleapis.com/codelab-elements/codelab-elements.js:264:634
at https://storage.googleapis.com/codelab-elements/codelab-elements.js:264:715
Also whenever I select the content module it doesn't show the selected module content. Instead this error show in console:
Uncaught TypeError: Failed to construct 'URL': Invalid base URL
at G.<anonymous> (codelab-elements.js:251:342)
at sb (codelab-elements.js:208:235)
at HTMLDivElement.ob (codelab-elements.js:210:22)
at HTMLDivElement.b (codelab-elements.js:205:50)
Currently, I'm using react on the client-side and node js on the server-side.
NodeJs Code:
Node Js code
React Code:
React Code

Related

Express.js : json data is not returned completely

I am developing an API for a chart that contains large JSON data, and sometimes JSON is not returned completely.
If I reload the API again after some reload, data is returned completely.
In the chrome network tab, I usually got
failed to load response data: no data found for a resource with the given identifier.
In the firefox network tab, I got the error as:

IBM Watson Assistant - Webhook Uncaught Error when saving URL

Problem:
Webhook URLs are not saved, which breakes the entire webhook functionality.
Reproduction:
When creating a new dialog skill in the classic experience, the following error is printed to console once I've entered a webhook URL in the respective options field.
DialogSkillOptions.jsx:210 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading '0')
at DialogSkillOptions.jsx:210:42
at s (bluemix-analytics.min.js:44:30656)
at Generator._invoke (bluemix-analytics.min.js:44:30409)
at Generator.next (bluemix-analytics.min.js:44:31019)
at C (app.46eb13fc2099d97e0fdd.js:1:3312231)
at i (app.46eb13fc2099d97e0fdd.js:1:3312434)
If one then tries again to change the URL, no error is thrown. However, the URL is still not saved correctly (trying to use it in a dialog node displays the "webhook URL missing" warning box).
For the URL I used different examples, including the one from documentation.

Efficiently fetch glTF data from an API GET endpoint within a CesiumJS client app

I am trying to build a small sandbox CesiumJS app for pedagogic purposes.
For that, I need to query some small glTF assets (2 small flat squares build from 4 simple triangles) available at an existing API GET endpoint, e.g: https://my-server.org/api/v2/data/collection/8/gltf/item.gltf. Then I would like to naturally display them within my Cesium app.
From this simple but yet fully functional answer: https://stackoverflow.com/a/71088611/6630397 I am able to fetch a JSON response from the API.
But when passing the full URL of a glTF asset, using for example the fetchBlob() function, it says:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://my-server.org/api/v2/data/collection/8/gltf/item.gltf. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing). Status code: 200.
Please note that if I click that link in my browser console, it successfully opens a pop-up for actually downloading the glTF file.
So, is it possible to make the same append automatically within my client application so that the glTF file is directly loaded in the Cesium globe? (if absolutely needed, a temporary storage in a local folder on the disk is OK)
Here is the documentation pages on which I rely so far: https://cesium.com/learn/cesiumjs/ref-doc/Resource.html but I cannot find and way to fetch a glTF object from a URL.
Maybe there is something to do with the native Fetch API? But my first attempt is not successful either, e.g.:
glTFFileURL = "https://my-server.org/api/v2/data/collection/8/gltf/item.gltf";
let glTFPromise = fetch(glTFFileURL);
console.log("glTFPromise:",glTFPromise);
glTFPromise.then((res) => {
console.log(res);
}).otherwise(err => {
console.log(err);
});
which returns all this stack trace:
glTFPromise: // <- this is the console.log() output
Promise { <state>: "pending"
<state>: "rejected
<reason>: TypeError: NetworkError when attempting to fetch resource.
columnNumber: 0
fileName: ""
lineNumber: 0
message: "NetworkError when attempting to fetch resource."
stack: ""
(...)
(!) Uncaught (in promise) TypeError: glTFPromise.then(...).otherwise is not a function
(...reference to the .otherwise() of the above code)
(!) Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote
resource at https://my-server.org/api/v2/data/collection/8/gltf/item.gltf.
(Reason: CORS header ‘Access-Control-Allow-Origin’ missing). Status code: 200.
(!) Uncaught (in promise) TypeError: NetworkError when attempting to fetch resource.
Doesn't the server.cjs already allows all the necessary for this to work out of the box: https://github.com/CesiumGS/cesium/blob/6f4c4cc7019aad071086effd575a146b76523e3c/server.cjs#L69-L76 ?
CORS error ref: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS/Errors/CORSMissingAllowOrigin
This is not a Cesium js-specific issue.
Your server has to allow CORS.

Failed to load resource: the server responded with a status of 404 (Not Found) Vue.js

I am trying to display a series of articles from a Google Alerts RSS Feed on my Vue.js application. My back end is Express.js.
Is my back end correct or do adjustments have to be made? If not, do I need a certain script in my index.html or something like "Vue.use(socket.io) " in my main.js?
This is my code.
I receive these errors when I run my application:
Error in my console

Requesting API leads to success on browser but status code 500 in node-red

I'm trying to call an API with "http request" node in node-red (node.js).
After setting an enviroment variable "HTTP_PROXY=http://******", I could call Web pages (such as "http: //google.com") with a response of status code 200, but failed to call the API with status code 500 in node-red.
I could call the API by entering URL directly on browser (Internet Explorer).
How can I solve the problem and call the API in node-red(node.js)? (what's the difference between the two means (node-red and browser))?
You have verified that the API is expecting certain headers, and throws an exception without them (ouch, bad practice!).
Anyway, to invoke the API with additional headers, you can use a change node to add them to the msg object, right before invoking the http request node:

Resources