My API it's running under another domain.. and I'm trying to configure proxy with Vercel ..
The app it's making requests to /api/test.json so I tried to... on vercel configuration
"redirects": [
{
"source": "/api/test.json",
"destination": "https://myapi.com/test.json",
}
],
"rewrites": [
{
"source": "/(.*)",
"destination": "/index.html"
}
]
And I received 404 from /api/test.json
Use the wildcard path matching :path* syntax:
// in vercel.json:
// for example proxying /api/ → https://backend-endpoint/
{
"rewrites": [
{
"source": "/api/:path*",
"destination": "https://backend-endpoint/:path*"
},
{
"source": "/api/:path*/",
"destination": "https://backend-endpoint/:path*/"
}
]
}
NOTE: You need both very identical objects under rewrites array as above in order to make things work properly. The example in the documentation is only the one without the trailing slash and it won't convert (for example) /api/auth/login/ to https://backend-endpoint/auth/login/, that example can only convert /api/auth/login to https://backend-endpoint/auth/login (without trailing slash /)
(it took me a day to realize that trailing slash / is actually very important).
Simply use rewrites
"rewrites": [
{
"source": "/api/test.json",
"destination": "https://myapi.com/test.json",
}
]
Then in your application
httpAgent
.get('/api/test.json)
.then(res => { console.log(res) })
Related
I have a question about rewrite configurations on Vercel, very similar to this vercel discussion. My problem is essentially the same but reverse:
I have a site on vercel (main.vercel.app), and I would like to rewrite different pages to other vercel sites. So what I want is:
main.vercel.app/page-a --> page-a.vercel.app
main.vercel.app/page-b --> page-b.vercel.app
When I tried this configuration, it would correctly load the page, but all the assets (page-a.vercel.app/styles.css etc.) would not be loaded:
{
"rewrites": [
{
"source": "/page-a",
"destination": "https://page-a.vercel.app/"
}
]
}
When I tried this configuration, it would redirect all the assets, but not the initial page:
{
"rewrites": [
{
"source": "/page-a(.*)",
"destination": "https://page-a.vercel.app$1"
}
]
}
So what's the correct configuration supposed to be?
What if you try merging the two rewrites?
According to you, one rewrite pattern is correct for the main page, and the other is for all other assets other than the main page. Since rewrites is a list and can hold multiple patterns, try merging the two objects and making it something like this:
{
"rewrites": [
{
"source": "/page-a",
"destination": "https://page-a.vercel.app/"
},
{
"source": "/page-a(.*)",
"destination": "https://page-a.vercel.app$1"
}
]
}
I have created a state machine with AWD CDK (typescript) and it all works fine. It is just the output of Lambda 1 which is the input for Lambda 2, has some sort of state machine padding which I am not interested in.
Definition of state machine:
{
"StartAt": "",
"States": {
"...applicationPdf": {
"Next": "...setApplicationProcessed",
"Type": "Task",
"Resource": "arn:aws:states:::lambda:invoke",
"Parameters": {
"FunctionName": "...applicationPdf",
"Payload.$": "$"
}
},
"...setApplicationProcessed": {
"Next": "Done",
"Type": "Task",
"Resource": "arn:aws:states:::lambda:invoke",
"Parameters": {
"...applicationPdf",
"Payload.$": "$"
}
},
"Done": {
"Type": "Succeed"
}
}
}
Output of Lambda1 (applicationPdf):
{
"ExecutedVersion": "$LATEST",
"Payload": {
...
},
"SdkHttpMetadata": {
"AllHttpHeaders": {
...
},
"HttpHeaders": {
....
},
"HttpStatusCode": 200
},
"SdkResponseMetadata": {
....
},
"StatusCode": 200
}
So I am only interested in Payload, not all the other stuff.
The reason I want to do is that is I want to run the 2nd lambda separately I just want the Event going into the Lambda, to be the Payload object, not the the object with ExecutedVersion etc.
Does anyone know how to do this?
I will have a look at the Parameters option of the definition, maybe the answer lies there.
Thanks for your question and for your interest in Step Functions.
The ResultSelector and OutputPath fields can be used to manipulate the output of a state, which can be particularly helpful when a state outputs values which you do not need access to in subsequent states. The difference between them is that ResultSelector is applied before the state's ResultPath is applied, while OutputPath is applied after it.
As you noted, you can use OutputPath to filter out any unwanted metadata before being passed on to the next state.
I found one solution, add the outputPath:
return new LambdaInvoke(this, 'lamba', {
lambdaFunction: Function.fromFunctionArn(this, name, this.createLabmdaArn('applicationPdf')),
outputPath: '$.Payload',
});
This seems to work and might be THE solution.
Serve static assets with an efficient cache policy. I get this if I audit my app. I added this code to nuxt.config but this would help.
render: {
static: {
maxAge: 2592000
}
},
its by default caching static assets 1h in browser. Where can I change it. or How?
You should configure your headers for your static files with Firebase:
https://firebase.google.com/docs/hosting/full-config#headers
// in firebase.json
"hosting": {
// ...
// Add the "headers" attribute within "hosting", override cache control
"headers": [ {
"source": "**/*.#(jpg|jpeg|gif|png)",
"headers": [ {
"key": "Cache-Control",
"value": "max-age=2592000"
} ]
}
]
}
This should give you the desired cache control values, depending on what you want to set there.
I am using elasticsearch 7 and I am trying to build up a search request in this way:
{
"query": {
"prefix": {
"document": {
"value": "/home/myfolder"
}
}
}
}
in order to find all folders starting with /home/myfolder ("document" element is stored like a path "/home/myfolder/file.txt". I am trying many ways but I didn't found any way to escape properly "/" character. In other links, people suggested to use "\/home/myfolder" or "/home/myfolder" but it does not work.
many thanks for any help
Since you are trying to match with the / use .keyword as below.
{
"query": {
"prefix": {
"document.keyword": {
"value": "/home/myfolder"
}
}
}
}
This is because when you dont use keyword, you are trying to match against an analyzed field and by default it removes the /.
Try running this and see how it breaks at each slash (/) to create the inverted index.
POST /_analyze
{
"text" :"/home/myfolder/document.txt"
}
I have a site built with create-react-app and hosted on Firebase Hosting. What can I do to specify the browser cache needs to be updated after new deploys, and ideally only for pages, assets, and stylesheets that have been changed since the last deploy?
Is there a way to access the deploy id and include that (or any other unique identifier) in the headers so the browser can compare to what it has in local storage or cache and determine whether a hard refresh is necessary? I looked over the Firebase Deploying as well as Full config docs but there's no mention on how to access hosting metadata like the last deploy time.
Setting a Cache-Control value to max-age=[any number] doesn't seem ideal because it disregards when the next deployment will occur (which might be unknown to begin with unless there are regular schedules).
I figured it out. Had to update the firebase.json file according to this Github comment:
{
"hosting": {
"headers": [
{ "source":"/service-worker.js", "headers": [{"key": "Cache-Control", "value": "no-cache"}] }
]
}
}
Please set "max-age=0" in your firebase.json.
"headers": [
{
"source": "/service-worker.js",
"headers": [
{
"key": "Cache-Control",
"value": "no-cache, no-store, must-revalidate"
}
]
},
{
"source": "**/*.#(jpg|jpeg|gif|png|svg|webp|js|css|eot|otf|ttf|ttc|woff|woff2|font.css)",
"headers": [
{
"key": "Cache-Control",
"value": "max-age=0"
}
]
}
]