I built a static web app and the html page is on one of my respositories. I built the API and it is on another repository. How do I link the two? Can I link the two? Or should I build a new static web app in the API repository?
You can link an existing Azure Functions app to an Azure Static Web Apps resource using 'Bring your own functions to Azure Static Web Apps'.
Example
Consider an existing Azure Functions app that exposes an endpoint via the following location.
https://my-functions-app.azurewebsites.net/api/getProducts
Once linked, you can access that same endpoint through the api path from your static web app, as shown in this example URL.
https://red-sea-123.azurestaticapps.net/api/getProducts
Both endpoint URLs point to the same function.
Link an existing Azure Functions app
Before you associate an existing Functions app, you first need to adjust to configuration of your static web app.
Set api_location value to an empty string ("") in the workflow
configuration file.
Open your Static Web Apps instance in the Azure portal.
From the Settings menu, select Functions.
From the Environment dropdown, select Production.
Next to the Functions source label, select Link to a Function app.
From the Subscription dropdown, select your Azure subscription name.
From the Function App dropdown, select the name of the existing
Functions app you want to link to your static web app.
Select the Link button.
Deployment
You're responsible for setting up a deployment workflow for your Azure Functions app.
See steps and more info here
Related
I have the followings TWO independent projects deployed at Azure from GitHub:
an Angular UI project as Static Web App (SWA)
an Node API project as Azure Function (AF)
AF can talk to local-run UI and Postman no problem.
When UI is deployed to Azure and talk to the same AF, it gets 405. To troubleshoot, I did
Query AF logs: FunctionAppLogs | where Level contains "error" returns zero record. FunctionAppLogs | order by TimeGenerated desc | limit 100 returns all Information for Level.
Thinking to get SWA's IP to AF's firewall rule, but it doesn't have networking tab for an IP.
When trying to enable Application Insights for SWA log, it says SWA must have at least one function
I followed this to deploy my Angular SWA. Only difference is his API AF are integrated into the project, mine is a independent project outside of the Angular.
Update, this is how I setup the SWA:
Add a Static Web App
Choose GitHub for publish source, and log in
Choose repository and branch
Complete a new Pull and Merge, project is auto-build and deployed
According to this document, you can enable Azure App Insights for Static Web Apps that use Azure Functions.
Firstly, to enable Application Insights we need an Application Insights resource.
Copy the instrumentation key for the SWA that you want your JavaScript telemetry to be sent. The same need to be added to the instrumentationKey or connectionString setting of the Application Insights JavaScript SDK.
You can add the Application Insights JavaScript SDK to your resource following one of the following two options:
npm Setup
JavaScript Snippet
Here is a sample project that you can refer to and for remote debugging you can check this document
REFERENCES:
Deeper analytics for Azure Static Web Apps
Add an API to Azure Static Web Apps with Azure Functions | Microsoft Docs
Study shows Static Web App (SWA) have integrated API when needs one, and this MS Doc has a Note SWA must have an API to use App Insights.
Another reason SWA must have an Azure Function is because it's backend running at AZ.
I have two-layer application my front end is written NuxtJS and my back end is written in .NET core.
I would like to publish this in azure. Should I be interested in azure static application or app services?
I would also like to create a subdomain where I can have a separate administration panel.
I would like to get this result:
exampledomain.com - Shop
admin.exampledomain.com - Admin panel
Can someone guide me how to publish such an application and how to create such a subdoemene in azure?
You can achieve that with Azure App Service, and publish multiple Web Apps inside the same Application Service Plan, but they will share the same compute resources.
To setup a custom domain, you just need to choose a plan that supports it and follow the following official doc:
https://learn.microsoft.com/en-us/azure/app-service/app-service-web-tutorial-custom-domain?tabs=cname
I'm trying to migrate a Azure Linux/Python function app from the consumption tier to a Elastic Premium tier. It turns out this is not so easy: https://github.com/Azure/Azure-Functions/issues/155 . You basically have to recreate the Function from scratch.
As my function is sitting behind a APIM I thought it might be possible to do this by:
Creating a new ASP with the correct tier
Deploy Function into new ASP
Switch the APIM back end of the API to the new function.
The trouble is I can't figure out how to do that last part. I can't seem to find where this is configured, or how to change it (via the portal or via CLI).
I've even done some splunking in the configs using the new resources front-end https://resources.azure.com/ and can't even find where the APIM configuration for the backends reside.
You just need to go to your APIM, click "APIs" tab, choose your api under "All APIs", click "..." button of your api then import another function app to your APIM api.
For example, I have a api under "All APIs" in my APIM. Its backend is a function app running with consumption plan. Like below screenshot:
Now I want to change the backend of the api to another function app which running with Elastic Premium tier. Just click "..." button of the api, and click "Import" like below screenshot:
Then choose "Function App" and select your new function app.
Is it possible to import azure web sites application setting from a file.I could not find a direct link from the azure portal.
Update
I want to copy some application settings from one azure web site to another azure web site in our test environment. I don't want to automate this, as we have our deployment infrastructure in place. I just want some simple solution where I can export the application settings from one web-site and import to another for testing.
want to copy some application settings from one azure web site to another azure web site in our test environment
If you check the Azure web app in Azure Resource Explorer, you can find Application settings info is under config/web section, and it provides an API to update the configuration of an app.
You can try to get Application settings of one website via Azure Resource Explorer, and then you can call Rest API to update another website Application settings. If you save Application settings of one Azure website in a file, you can read file content and construct request based on it and send request to update another website.
You could upload a fresh copy of your web.config, but that'll recycle your app when you do so. That's about the only support out-of-the-box for manually changing settings via a file.
You could also do the following:
Create a Settings class that's a singleton and reads settings from a file.
Within the Settings class, set up a FileSystemWatcher on the file containing your settings.
On the FileSystemWatcher.OnChanged event, re-read your settings file.
As to Azure Portal you can go to Configuration/Application settings and open Advanced edit where you can paste JSON version of the settings. You need to do it separately for Connection strings. (If you already have settings in Azure then you can copy them from there - what would be an export in that case).
Connection strings
We have BizSpark subscription with shared app service plan, where we are hosting our product. I need to host another version of the project for testing purpose, which fits into a free tier. I have checked the azure portals, but there is no provision to add a new service plan. does the BizSpark subscription support only one app service plan or am I missing anything?
Because an App Service services is an underlying component to other services, there isn't a simple way to directly create an App Service.
Since the only use case to create an App Service is to put something in it, the logic (I imagine) behind the Portals is that you create the resources you require and and it will create dependent resources within that process.
(Using the New Portal)
In order to create a new App Service plan, presuming you are deploying a new Web App. Click on New, Web + Mobile and then Web App.
When you click on Web App you will get this screen, if you fill in the details, and click App Service plan / Location at the bottom, you will be given the opportunity to select either an existing App Service or to create a new one.
The easiest solution would be to create a new Web app and when asked for App Service create a new one .. or use Azure Resource Manager template to achieve this: https://azure.microsoft.com/en-gb/documentation/templates/.
If it's another version of the App for testing purposes, why not use Deployment Slots? Slots have their custom URL separate from the Production app, separated configuration, domain bindings, it's like an App inside an App. You'll be able (if you want) to even swap the content of the Production environment with the Testing one for example.
And you don't incur in any extra cost because it runs on the resources of the current App Service :)