OAuth Integration

Byg sikre integrationer med Shoporama API ved hjælp af OAuth 2.0

Hvad er OAuth?

OAuth gør det muligt for eksterne applikationer at få sikker adgang til Shoporama API'et på vegne af dine brugere, uden at de skal dele deres login-oplysninger.

Sicher und geschützt

Ingen deling af passwords. Brugerne logger ind direkte hos Shoporama

Nem integration

Standard OAuth 2.0 flow som du kender fra andre tjenester

Fleksibel

Vælg præcist hvilke rettigheder din app skal have

OAuth Flow - Trin for trin

1

Send bruger til Shoporama

Ihre Anwendung sendet den Benutzer an den OAuth-Endpunkt von Shoporama

https://www.shoporama.dk/admin/oauth/login?
  client_id=Din_App_Navn
  redirect_uri=https://example.com/callback
  state=unik_session_id

2

Benutzer meldet sich an

Der Benutzer meldet sich mit seinen Shoporama-Anmeldedaten an und wählt aus:

Welcher Shop Zugang erhalten soll
Zugriffsstufe (Lesen, Schreiben oder Vollzugriff)

3

API-Token erhalten

Nach der Authentifizierung wird der Benutzer mit dem Token zu Ihrer Anwendung zurückgeschickt:

https://example.com/callback?
  token=13836332c62b718f1fa2...
  shop_url=demo.shoporama.dk
  shop_name=Demo Shop
  api_endpoint=https://www.shoporama.dk/REST
  webshop_id=1
  access_level=all
  state=unik_session_id

4

Verwenden Sie die API

Verwenden Sie das Token, um die Shoporama-API aufzurufen:

curl -H "Authorization: 13836332c62b718f1fa2..." \
     https://www.shoporama.dk/REST/product

Klar til at komme i gang?

Beginnen Sie mit dem Testen des OAuth-Flows oder lesen Sie mehr über die API

OAuth Flow testen API-Dokumentation lesen

Komplette Implementeringseksempler

Fuld OAuth flow implementation - klar til copy/paste

Vanilla PHP Implementation

Ren PHP uden frameworks - en enkelt fil der håndterer hele OAuth flowet

<?php
// oauth.php - Gem denne fil på din server
session_start();

// Konfiguration - RET DISSE VÆRDIER
$CLIENT_ID = "Dit App Navn";
$REDIRECT_URI = "https://din-side.dk/oauth.php";
$OAUTH_URL = "https://www.shoporama.dk/admin/oauth/login";

// Start OAuth
if (isset($_GET["login"])) {
    $_SESSION["state"] = bin2hex(random_bytes(16));
    $url = $OAUTH_URL . "?" . http_build_query([
        "client_id" => $CLIENT_ID,
        "redirect_uri" => $REDIRECT_URI,
        "state" => $_SESSION["state"]
    ]);
    header("Location: $url");
    exit;
}

// Modtag token
if (isset($_GET["token"]) && $_GET["state"] === $_SESSION["state"]) {
    $_SESSION["token"] = $_GET["token"];
    $_SESSION["api_url"] = $_GET["api_endpoint"];
    echo "Success! Token gemt.";
    echo "
Test API";
    exit;
}

// Test API
if (isset($_GET["test"]) && isset($_SESSION["token"])) {
    $ch = curl_init($_SESSION["api_url"] . "/product?limit=1");
    curl_setopt($ch, CURLOPT_HTTPHEADER, ["Authorization: " . $_SESSION["token"]]);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
    $result = curl_exec($ch);
    echo "" . htmlspecialchars($result) . "";
    exit;
}

// Start side
echo "Login med Shoporama";
?>

Sådan bruger du det:

Kopier koden til en fil kaldet oauth.php
Ret $CLIENT_ID og $REDIRECT_URI
Upload filen til din server
Besøg siden og klik "Login med Shoporama"

Laravel Implementation

OAuth implementation med Laravel framework - professionel og skalerbar løsning

<?php
// routes/web.php
use App\Http\Controllers\OAuthController;

Route::get("/oauth/start", [OAuthController::class, "start"])->name("oauth.start");
Route::get("/oauth/callback", [OAuthController::class, "callback"])->name("oauth.callback");
Route::get("/api/products", [OAuthController::class, "getProducts"])->middleware("auth.oauth");

// app/Http/Controllers/OAuthController.php
namespace App\Http\Controllers;

use Illuminate\Http\Request;
use Illuminate\Support\Facades\Http;
use Illuminate\Support\Str;

class OAuthController extends Controller
{
    private $config;
    
    public function __construct()
    {
        $this->config = [
            "client_id" => config("services.shoporama.client_id", "Min Laravel App"),
            "redirect_uri" => route("oauth.callback"),
            "oauth_endpoint" => "https://www.shoporama.dk/admin/oauth/login"
        ];
    }
    
    public function start(Request $request)
    {
        // Generer state for CSRF beskyttelse
        $state = Str::random(40);
        $request->session()->put("oauth_state", $state);
        
        // Byg OAuth URL
        $params = [
            "client_id" => $this->config["client_id"],
            "redirect_uri" => $this->config["redirect_uri"],
            "state" => $state
        ];
        
        $authUrl = $this->config["oauth_endpoint"] . "?" . http_build_query($params);
        
        return redirect($authUrl);
    }
    
    public function callback(Request $request)
    {
        // Håndter fejl
        if ($request->has("error")) {
            return redirect()->route("login")->with("error", 
                "OAuth fejl: " . $request->get("error_description", "Ukendt fejl")
            );
        }
        
        // Verificer state
        if ($request->get("state") !== $request->session()->get("oauth_state")) {
            return redirect()->route("login")->with("error", "Ugyldig state parameter");
        }
        
        // Gem token data
        $tokenData = [
            "token" => $request->get("token"),
            "shop_url" => $request->get("shop_url"),
            "shop_name" => $request->get("shop_name"),
            "api_endpoint" => $request->get("api_endpoint"),
            "webshop_id" => $request->get("webshop_id"),
            "access_level" => $request->get("access_level"),
            "granted_at" => now()
        ];
        
        // Gem i database
        auth()->user()->update([
            "shoporama_token" => encrypt(json_encode($tokenData))
        ]);
        
        // Ryd state
        $request->session()->forget("oauth_state");
        
        return redirect()->route("dashboard")->with("success", 
            "Forbundet til " . $tokenData["shop_name"]
        );
    }
    
    public function getProducts(Request $request)
    {
        $user = auth()->user();
        
        if (!$user->shoporama_token) {
            return response()->json(["error" => "Not authenticated"], 401);
        }
        
        $tokenData = json_decode(decrypt($user->shoporama_token), true);
        
        $response = Http::withHeaders([
            "Authorization" => $tokenData["token"],
            "Accept" => "application/json"
        ])->get($tokenData["api_endpoint"] . "/product", [
            "limit" => 10
        ]);
        
        if ($response->successful()) {
            return response()->json($response->json());
        }
        
        return response()->json(["error" => "API request failed"], $response->status());
    }
}
?>

Laravel Features:

Bruger Laravel's built-in session og encryption
Tokens gemmes krypteret i databasen
Middleware for at beskytte routes
Konfiguration via .env fil
HTTP client med fejlhåndtering

Frontend JavaScript Implementation

En komplet HTML side med JavaScript OAuth flow - ingen server kode nødvendig

<!DOCTYPE html>
<html>
<head>
    <title>Shoporama OAuth Demo</title>
</head>
<body>
    <div id="app">
        <button onclick="startOAuth()">Login med Shoporama</button>
        <div id="result"></div>
    </div>

    <script>
    // Konfiguration - RET DISSE
    const CLIENT_ID = "Dit App Navn";
    const REDIRECT_URI = window.location.origin + window.location.pathname;
    const OAUTH_URL = "https://www.shoporama.dk/admin/oauth/login";
    
    // Start OAuth
    function startOAuth() {
        const state = Math.random().toString(36).substring(7);
        sessionStorage.setItem("oauth_state", state);
        
        const params = new URLSearchParams({
            client_id: CLIENT_ID,
            redirect_uri: REDIRECT_URI,
            state: state
        });
        
        window.location.href = `${OAUTH_URL}?${params}`;
    }
    
    // Check for OAuth callback
    const urlParams = new URLSearchParams(window.location.search);
    if (urlParams.get("token")) {
        const state = urlParams.get("state");
        const savedState = sessionStorage.getItem("oauth_state");
        
        if (state === savedState) {
            // Gem token data
            const tokenData = {
                token: urlParams.get("token"),
                api_endpoint: urlParams.get("api_endpoint"),
                shop_name: urlParams.get("shop_name")
            };
            
            localStorage.setItem("shoporama_oauth", JSON.stringify(tokenData));
            sessionStorage.removeItem("oauth_state");
            
            // Vis success
            document.getElementById("result").innerHTML = `
                <h2>Success!</h2>
                <p>Logget ind på: ${tokenData.shop_name}</p>
                <button onclick="testAPI()">Test API</button>
            `;
            
            // Ryd URL
            window.history.replaceState({}, document.title, window.location.pathname);
        }
    }
    
    // Test API
    async function testAPI() {
        const data = JSON.parse(localStorage.getItem("shoporama_oauth"));
        if (!data) return alert("Ikke logget ind");
        
        try {
            const response = await fetch(data.api_endpoint + "/product?limit=1", {
                headers: { "Authorization": data.token }
            });
            const products = await response.json();
            document.getElementById("result").innerHTML += 
                "<pre>" + JSON.stringify(products, null, 2) + "</pre>";
        } catch (error) {
            alert("API fejl: " + error.message);
        }
    }
    </script>
</body>
</html>

Bemærk om CORS:

Frontend JavaScript kan opleve CORS problemer ved API kald. For produktion anbefales en backend proxy eller officielle CORS headers fra Shoporama.

Node.js/Express Implementation

Server-side JavaScript implementation med Express.js

const express = require('express');
const session = require('express-session');
const crypto = require('crypto');
const app = express();

// Session setup
app.use(session({
    secret: 'your-secret-key',
    resave: false,
    saveUninitialized: true
}));

// OAuth konfiguration
const OAUTH_CONFIG = {
    client_id: 'Min Shoporama App',
    redirect_uri: 'https://example.com/oauth/callback',
    oauth_endpoint: 'https://www.shoporama.dk/admin/oauth/login'
};

// Start OAuth flow
app.get('/oauth/start', (req, res) => {
    // Generer state til CSRF beskyttelse
    const state = crypto.randomBytes(16).toString('hex');
    req.session.oauth_state = state;
    
    // Byg OAuth URL
    const params = new URLSearchParams({
        client_id: OAUTH_CONFIG.client_id,
        redirect_uri: OAUTH_CONFIG.redirect_uri,
        state: state
    });
    
    const authUrl = `${OAUTH_CONFIG.oauth_endpoint}?${params}`;
    res.redirect(authUrl);
});

// OAuth callback handler
app.get('/oauth/callback', (req, res) => {
    const { token, state, error, error_description } = req.query;
    
    // Håndter fejl
    if (error) {
        console.error('OAuth Error:', error, error_description);
        return res.status(400).json({
            error: error,
            description: error_description
        });
    }
    
    // Verificer state
    if (state !== req.session.oauth_state) {
        return res.status(400).json({
            error: 'Invalid state parameter'
        });
    }
    
    // Gem token data
    req.session.oauth_token = {
        token: token,
        shop_url: req.query.shop_url,
        shop_name: req.query.shop_name,
        api_endpoint: req.query.api_endpoint,
        webshop_id: req.query.webshop_id,
        access_level: req.query.access_level,
        granted_at: new Date()
    };
    
    // Ryd state
    delete req.session.oauth_state;
    
    // Success response
    res.json({
        success: true,
        shop_name: req.query.shop_name,
        access_level: req.query.access_level
    });
});

// API kald med OAuth token
app.get('/api/products', async (req, res) => {
    if (!req.session.oauth_token) {
        return res.status(401).json({ error: 'Not authenticated' });
    }
    
    try {
        const response = await fetch(
            `${req.session.oauth_token.api_endpoint}/product?limit=10`,
            {
                headers: {
                    'Authorization': req.session.oauth_token.token,
                    'Accept': 'application/json'
                }
            }
        );
        
        const data = await response.json();
        res.json(data);
    } catch (error) {
        res.status(500).json({ error: error.message });
    }
});

app.listen(3000, () => {
    console.log('OAuth app running on port 3000');
});

Installation:

npm install express express-session
node app.js

Python/Flask Implementation

Python implementation med Flask framework

from flask import Flask, redirect, request, session, jsonify
import secrets
import requests
from urllib.parse import urlencode

app = Flask(__name__)
app.secret_key = 'your-secret-key'

# OAuth konfiguration
OAUTH_CONFIG = {
    'client_id': 'Min Shoporama App',
    'redirect_uri': 'https://example.com/oauth/callback',
    'oauth_endpoint': 'https://www.shoporama.dk/admin/oauth/login'
}

@app.route('/oauth/start')
def oauth_start():
    # Generer state til CSRF beskyttelse
    state = secrets.token_urlsafe(16)
    session['oauth_state'] = state
    
    # Byg OAuth URL
    params = {
        'client_id': OAUTH_CONFIG['client_id'],
        'redirect_uri': OAUTH_CONFIG['redirect_uri'],
        'state': state
    }
    
    auth_url = f"{OAUTH_CONFIG['oauth_endpoint']}?{urlencode(params)}"
    return redirect(auth_url)

@app.route('/oauth/callback')
def oauth_callback():
    # Hent parametre
    token = request.args.get('token')
    state = request.args.get('state')
    error = request.args.get('error')
    error_description = request.args.get('error_description')
    
    # Håndter fejl
    if error:
        return jsonify({
            'error': error,
            'description': error_description
        }), 400
    
    # Verificer state
    if state != session.get('oauth_state'):
        return jsonify({'error': 'Invalid state parameter'}), 400
    
    # Gem token data
    session['oauth_token'] = {
        'token': token,
        'shop_url': request.args.get('shop_url'),
        'shop_name': request.args.get('shop_name'),
        'api_endpoint': request.args.get('api_endpoint'),
        'webshop_id': request.args.get('webshop_id'),
        'access_level': request.args.get('access_level')
    }
    
    # Ryd state
    session.pop('oauth_state', None)
    
    return jsonify({
        'success': True,
        'shop_name': session['oauth_token']['shop_name'],
        'access_level': session['oauth_token']['access_level']
    })

@app.route('/api/products')
def get_products():
    # Check authentication
    if 'oauth_token' not in session:
        return jsonify({'error': 'Not authenticated'}), 401
    
    # Kald Shoporama API
    token_data = session['oauth_token']
    headers = {
        'Authorization': token_data['token'],
        'Accept': 'application/json'
    }
    
    response = requests.get(
        f"{token_data['api_endpoint']}/product?limit=10",
        headers=headers
    )
    
    if response.status_code == 200:
        return jsonify(response.json())
    else:
        return jsonify({'error': 'API request failed'}), response.status_code

if __name__ == '__main__':
    app.run(debug=True)

Installation:

pip install flask requests
python app.py

Fehlersuche und häufige Probleme

Häufige OAuth-Fehler

access_denied

Dem Benutzer wurde der Zugang verweigert. Zeigen Sie eine freundliche Nachricht an und lassen Sie den Benutzer es erneut versuchen.

invalid_client

Unbekannte client_id. Überprüfen Sie, ob der Name Ihrer Anwendung korrekt ist.

invalid_redirect_uri

URI der Umleitung stimmt nicht überein. Es muss genau die gleiche URL sein.

state_mismatch

Zustandsparameter stimmt nicht überein. Möglicher CSRF-Angriff oder Timeout der Sitzung.

API-Fehler

401 Unauthorized

Das Token ist ungültig oder abgelaufen. Fordern Sie den Benutzer auf, sich erneut anzumelden.

403 Forbidden

Das Token verfügt nicht über die erforderlichen Rechte. Prüfen Sie access_level.

429 Too Many Requests

Tarifgrenze erreicht. Bitte warten Sie bis zur nächsten Anfrage.

500 Server Error

Interner Fehler. Bitte versuchen Sie es später noch einmal oder kontaktieren Sie den Support.

Tipps zur Fehlerbehebung

Test mit OAuth Test Client

Verwenden Sie unseren Test-Client, um zu überprüfen, ob Ihr OAuth-Flow korrekt funktioniert.

Test OAuth Flow →

Alle Parameter protokollieren

Protokollieren Sie Status, Token und andere Parameter, um Probleme zu beheben.

Sicherheit und bewährte Praktiken

Token-Speicherung

• Token niemals in Cookies oder localStorage speichern
• Serverseitige Sitzungen oder verschlüsselte Datenbank verwenden
• Token vor der Speicherung verschlüsseln
• Token löschen, wenn sie nicht mehr verwendet werden

CSRF-Schutz

• Verwenden Sie immer den Zustandsparameter
• Erzeugen eines eindeutigen Status für jede Sitzung
• Status im Rückruf überprüfen
• Timeout-Status nach einer kurzen Zeit

HTTPS erforderlich

• Nur HTTPS für redirect_uri verwenden
• Alle API-Aufrufe müssen über HTTPS erfolgen.
• Ausnahme: localhost für Entwicklung
• Gültigkeit des SSL-Zertifikats prüfen

Zugangsebenen erklärt

Ebene	Beschreibung	Erlaubt	Nicht erlaubt
read	Lesezugriff auf alle Daten	GET-Anfragen an alle Endpunkte	POST, PUT, DELETE-Anfragen
write	Daten lesen und schreiben	Alle HTTP-Methoden	Webshop löschen, Eigentümer wechseln
all	Voller Administratorenzugang	Alles, einschließlich gefährlicher Operationen	Nichts - volle Kontrolle

Empfehlung: Beginnen Sie während der Entwicklung mit einem "Lese"-Zugriff und steigen Sie erst dann auf "Schreib"- oder "Alle"-Zugriff um, wenn dies für die Funktionalität Ihrer Anwendung erforderlich ist.

Vollständige API-Dokumentation

Alle verfügbaren Endpunkte, Methoden und Parameter finden Sie in unserer REST-API-Dokumentation

Siehe API-Dokumentation

Erstellen Sie Ihren Shop

Buchen Sie einen Anruf

Vielen Dank für Ihre Anfrage!

Notsituation

OAuth Integration

Hvad er OAuth?

Sicher und geschützt

Nem integration

Fleksibel

OAuth Flow - Trin for trin

Send bruger til Shoporama

Benutzer meldet sich an

API-Token erhalten

Verwenden Sie die API

Klar til at komme i gang?

Komplette Implementeringseksempler

Vanilla PHP Implementation

Sådan bruger du det:

Laravel Implementation

Laravel Features:

Frontend JavaScript Implementation

Bemærk om CORS:

Node.js/Express Implementation

Installation:

Python/Flask Implementation

Installation:

Fehlersuche und häufige Probleme

Häufige OAuth-Fehler

access_denied

invalid_client

invalid_redirect_uri

state_mismatch

API-Fehler

401 Unauthorized

403 Forbidden

429 Too Many Requests

500 Server Error

Tipps zur Fehlerbehebung

Test mit OAuth Test Client

Alle Parameter protokollieren

Sicherheit und bewährte Praktiken

Token-Speicherung

CSRF-Schutz

HTTPS erforderlich

Zugangsebenen erklärt

Vollständige API-Dokumentation

Holen Sie sich Tipps für Ihren Webshop

Cookie-Einstellungen

Erforderliche Cookies

Cookies analysieren

Marketing-Cookies