mirror of
https://github.com/withastro/astro.git
synced 2025-01-06 22:10:10 -05:00
c9d51107d0
* feat(actions): getActionPath() * feat: take trailing slash into account * fix * fix * Update wise-boxes-develop.md * Apply suggestions from code review Co-authored-by: Sarah Rainsberger <5098874+sarah11918@users.noreply.github.com> * Update .changeset/wise-boxes-develop.md Co-authored-by: Sarah Rainsberger <5098874+sarah11918@users.noreply.github.com> --------- Co-authored-by: Sarah Rainsberger <5098874+sarah11918@users.noreply.github.com> Co-authored-by: Emanuele Stoppa <my.burning@gmail.com>
1.5 KiB
1.5 KiB
| astro |
|---|
| minor |
Adds a new getActionPath() helper available from astro:actions
Astro 5.1 introduces a new helper function, getActionPath() to give you more flexibility when calling your action.
Calling getActionPath() with your action returns its URL path so you can make a fetch() request with custom headers, or use your action with an API such as navigator.sendBeacon(). Then, you can handle the custom-formatted returned data as needed, just as if you had called an action directly.
This example shows how to call a defined like action passing the Authorization header and the keepalive option:
<script>
// src/components/my-component.astro
import { actions, getActionPath } from 'astro:actions'
await fetch(getActionPath(actions.like), {
method: 'POST',
headers: {
'Content-Type': 'application/json',
Authorization: 'Bearer YOUR_TOKEN'
},
body: JSON.stringify({ id: 'YOUR_ID' }),
keepalive: true
})
</script>
This example shows how to call the same like action using the sendBeacon API:
<script>
// src/components/my-component.astro
import { actions, getActionPath } from 'astro:actions'
navigator.sendBeacon(
getActionPath(actions.like),
new Blob([JSON.stringify({ id: 'YOUR_ID' })], {
type: 'application/json'
})
)
</script>