Hello, I'm new to Geotab Add-in development. Just created a simple Asp.Net Core WebApp with Razor pages and deployed to Azure. The web app is rendering fine by itself and accessible by public; but once I add an "Add-in" in My Geotab and configured the url to point to it, it seemed to only want to load briefly and then it disappeared. Behind the browser, there was some js lib errors that were not existing when the website is standalone. According to your dev guide, there are two types of Add-ins, "Pages" and "Buttons" - "A custom page Add-in can be thought of as a complete web application inside your Geotab account". But looks like there are some restrictions based on the issue I encountered. What are these restrictions?  In my standalone web app, I also added CORS policy to allow origin from   https://my.geotab.com.  Thanks for your time and attention.

A Webapp developed in .net and deployed at Azure (public) cannot be loaded in Add-in

Hi everyone, we're seeing a new issue with a long-running MyGeotab add-in and wanted to check whether others are seeing the same pattern. We have a custom add-in package with standard pages plus Map/Trips add-ins. Standard pages still load, but Map/Trips add-ins fail to install at runtime. Previously this occurred for accounts with Geotab camera devices but now it seems to affect any account. At a high level, it looks like this started after camera add-in behavior changed in our environment. What we're seeingStandard custom add-in pages workMap/Trips add-ins fail with:“Add-in can't be installed”“Can't be loaded”This is reproducible in affected accounts What we testedHard refresh / cache resetAdded bootstrap and handshake logging in map iframe entry pagesConfirmed map iframe boot logs appearAdded asset health checks; assets are reachable (HTTP 200)Added additional safe bootstrap delegation + late-binding handler logic New technical detail we foundWe're also seeing runtime logs from a separate camera add-in bundle (not our code), including:RegisteredName: "mygeotab-camera-addin"CAMERA ADD-IN JURISDICTION: EU/USfeature-flag logic around jurisdiction mismatch handling So while we can't prove causation yet, this suggests a coexistence/platform-level interaction may be affecting map add-in install/hello flow for other custom add-ins. Why we're postingWe'd like to confirm whether there were any recent platform changes affecting Map Add-In install/handshake behavior when camera add-ins are present.If anyone from Geotab or other partners has guidance, we'd appreciate:Any known changes to Map Add-In install/hello flowKnown coexistence constraints with mygeotab-camera-addinRecommended compatibility pattern for custom map add-ins in mixed add-in environmentsThanks in advance.

MyGeotab Map Add-In no longer loading

As per the subject. I scaffolded the add-in using the generator-addin, I did add the Zenith React system and have been able to get the add-in to work under the dev environment it provided, but when I add the configuration to a database, the requests just ramp up like my add-in is being refreshed or some state I'm depending on is being reset and triggering fetching all the data again.  When testing, it will back about 150ish requests, but live it will cascade to 2000+ and hit the rate limits. I had added some fallback to delay requests if it hit a specific number, but it doesn't appear to work live.  The app flow is to get all database devices and check if they have the Iridium feature. Get the last stop date, and search over the last debug record of the IMEI number and Poll dates. I've made a similar add-in for submitting engine data for Custom Devices, but it didn't use React.  Happy to share what I can of the source code  

My Addin works under the development environment but when installed to a database will go over the rate limits

Hello,I am working on a mobile application that integrates with the Geotab Drive app through deep link navigation as an add-in. Issue: While we can successfully receive deep link navigation when users access our app from Geotab Drive, there is currently no intent or deep link triggered when users log out from the Geotab Drive app. This makes it difficult for our application to detect when the Geotab Drive session has ended. Is there anything from the add-in framework we could use to get notified when the session has ended so we can end our app session too?Alternatively, is there a REST API endpoint we can periodically request to check if the user is still connected? I tried using the Geotab SDK, which seems to have this information, but when we include the Geotab Drive SDK inside our app, it runs in a separate app process. So if the user has the Geotab Drive app installed externally, there is no connection between the SDK and the actual app. Thank you for your assistance.Best regards

Geotab Drive Add-in logout notification

We are developing a Geotab Add-In where certain vehicle data is processed externally, and the prediction results are then fetched from an external system but displayed inside the Add-In. Since this requires authenticated API calls, what is the recommended best practice in the Geotab ecosystem for authentication?Should an Add-In rely on API keys or implement OAuth2 for secure access?If API keys are used, what is the recommended way to provision and deliver them to customers in a secure and user-friendly manner?I haven't been able to find documentation that clearly explains which approach is preferred.

How to Properly Handle Data Access and Authentication in a Geotab Add-In

I am developing an add-in for Geotab Drive. I want my add-in to call my own API (hosted on prem) which uses a bearer token for authentication. As we know, the add-in is front end only so I cannot store my secrets there. Where should I store the secrets securely to be able to obtain the token to then call my API from the add-in? My other apps store them in key vault, but it's not obvious how to implement that here. Should there be some sort of back-end proxy going on here? All I have now is a React add-in running locally. Please advise.

How to call my own API from Geotab Drive add-in?

Hey guys, Any ideas on why I'm getting the following warning and an empty page when creating our add-in with the json config of: {
    "name": "orderNow",
    "supportEmail": "support@test.io",
    "version": "2.0.8",
    "items": [
        {
            "url": "https://hostUrl.io/plugin.html",
            "path": "ActivityLink/",
            "menuName": {
                "en": "Connection Settings"
            },
            "svgIcon": "https://hostUrl.io/orderNow/images/icon.svg"
        }
    ],
    "isSigned": false
}The add-in does show up in the proper place but I'm getting an empty page with this warning in the console: No routes matched location "/addin-addinName"We've built the add in on top of the Geotab Add In generator repo which prefilled most of our configurations / webpack configs. The url is pointing to the distribution version of the plugin but for some reason it doesn't load properly. Our webpack config for the build: const webpack = require("webpack");
const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const CopyWebpackPlugin = require("copy-webpack-plugin");
const config = require("./src/config.json");
 
const { name: appName } = config;
 
const transform = function (content, path) {
  let config = JSON.parse(content);
  let host = config.dev.dist.host;
  let len = config.items.length;
  const { name } = config;
 
  for (let i = 0; i &lt; len; i++) {
    config.items[i].url = host + config.items[i].url;
 
    if (config.items[i].svgIcon) {
      config.items[i].svgIcon = host + config.items[i].svgIcon;
    }
 
    if (config.items[i].icon) {
      config.items[i].icon = host + config.items[i].icon;
    }
  }
 
  delete config["dev"];
  let response = JSON.stringify(config, null, 2);
  // Returned string is written to file
  return response;
};
 
const jsFileName = () =&gt; {
  let fileName = "[name]-[contenthash].js";
 
  return fileName;
};
 
module.exports = {
  mode: "production",
  entry: {
    bundle: path.resolve(__dirname, "src/app/index.js"),
  },
  output: {
    path: path.resolve(__dirname, "dist"),
    filename: jsFileName,
    assetModuleFilename: "[name][ext]",
    clean: true,
  },
  devServer: {
    static: {
      directory: path.resolve(__dirname, "dist"),
    },
    port: 3000,
    open: true,
    hot: true,
    compress: true,
    historyApiFallback: true,
  },
  devtool: "source-map",
  module: {
    rules: [
      {
        test: /\.tsx?$/,
        use: "ts-loader",
        exclude: /node_modules/,
      },
      {
        test: /\.scss/,
        use: ["style-loader", "css-loader", "sass-loader"],
      },
      {
        test: /\.css$/i,
        use: [MiniCssExtractPlugin.loader, "css-loader", "postcss-loader"],
      },
      {
        test: /\.(js|jsx)$/,
        exclude: [/node_modules/],
        use: {
          loader: "babel-loader",
          options: {
            presets: [
              "@babel/preset-env",
              [
                "@babel/preset-react",
                {
                  runtime: "automatic",
                },
              ],
            ],
          },
        },
      },
      {
        test: /\.(png|svg|jpg|jpeg|gif)$/i,
        type: "asset/resource",
      },
    ],
  },
  resolve: {
    extensions: [".ts", ".tsx", ".js", ".jsx"], // Ensure TypeScript files can be resolved
  },
  plugins: [
    new MiniCssExtractPlugin({
      filename: "styles.css",
      chunkFilename: "styles.css",
    }),
    new HtmlWebpackPlugin({
      title: "plugin",
      filename: `plugin.html`,
      template: "src/app/plugin.html",
      inject: "body",
    }),
    new CopyWebpackPlugin({
      patterns: [
        { from: "./src/app/images/icon.svg", to: "images/" },
        {
          from: "./src/config.json",
          transform: transform,
          to: "configuration.json",
        },
      ],
    }),
    new webpack.DefinePlugin({
      "process.env.REACT_APP_PROJECT_ID": JSON.stringify(
        process.env.REACT_APP_PROJECT_ID
      ),
      "process.env.REACT_APP_ENV": JSON.stringify(process.env.REACT_APP_ENV),
      "process.env.BE_PUBLIC_API_BASE_URL": JSON.stringify(
        process.env.BE_PUBLIC_API_BASE_URL
      ),
      "process.env.BE_PUBLIC_APP_API_KEY": JSON.stringify(
        process.env.BE_PUBLIC_APP_API_KEY
      )
    }),
  ],
};The dist html file does have the js bundle in it as well which looks like this: &lt;!doctype html&gt;&lt;html&gt;&lt;head&gt;&lt;meta charset="utf-8"/&gt;&lt;meta http-equiv="x-ua-compatible" content="ie=edge"/&gt;&lt;meta name="description" content=""/&gt;&lt;meta name="viewport" content="width=device-width,initial-scale=1"/&gt;&lt;title&gt;order-now&lt;/title&gt;&lt;link href="styles.css" rel="stylesheet"&gt;&lt;/head&gt;&lt;body&gt;&lt;div id="plugin-app"&gt;&lt;div id="plugin"&gt;&lt;header class="geotabPageHeader"&gt;&lt;h1 class="geotabPageName"&gt;Test Plugin &lt;span class="subdued"&gt;Subtitle&lt;/span&gt;&lt;/h1&gt;&lt;div class="pageNameSecondary"&gt;&lt;h3 class="geotabSecondaryTitle"&gt;by: &lt;span id="plugin-user"&gt;&lt;/span&gt;&lt;/h3&gt;&lt;/div&gt;&lt;/header&gt;&lt;/div&gt;&lt;/div&gt;&lt;script defer="defer" src="bundle-a4d4cf3841901f6be89a.js"&gt;&lt;/script&gt;&lt;/body&gt;&lt;/html&gt;It seems that React doesn't seem to be able to mount on it which is weird as the dev version does work locally and loads the emulated login flow with the app  Can this be caused by the way our router is set up in app.jsx? const App = ({ geotabApi, geotabState, appName }) =&gt; {
  const logger = useMemo(() =&gt; Logger(appName), [appName]);
  const [context, setContext] = useState({ geotabApi, geotabState, logger });
 
  useEffect(() =&gt; {
    async function fetchSession() {
      try {
        geotabApi.getSession((session) =&gt; {
          if (session) {
            setContext((prev) =&gt; ({
              ...prev,
              database: session.database,
              sessionUser: session.userName,
              sessionId: session.sessionId,
            }));
          }
        });
      } catch (error) {
        logger.error("Failed to fetch Geotab session", error);
      }
    }
 
    fetchSession();
  }, [geotabApi, logger]);
 
  return (
    &lt;&gt;
      &lt;GeotabContext.Provider value={[context, setContext]}&gt;
        &lt;Router&gt;
          &lt;Routes&gt;
            &lt;Route path="/" element={&lt;ConnectionSettings /&gt;} /&gt;
            &lt;Route path="/setup/pillars" element={&lt;PillarConfig /&gt;} /&gt;
          &lt;/Routes&gt;
        &lt;/Router&gt;
      &lt;/GeotabContext.Provider&gt;
    &lt;/&gt;
  );
};
 
export default App; 

Getting No routes matched location "/addin-addinName" when trying to add add-in

The docs explain there are two types of AddIns, pages and buttons. Are button AddIns available in the Drive App, specifically on the "main" page? If so, how do we configure the AddIn config?

Can button type Add-Ins be added to the Geotab Drive App?

Hi, i would like to know if anyone has some general code structure for embedding source code into an addin's configuration file? I've been trying to do this with the help of the documentation provided in geotab developers, though had no luck getting the add-in to work. Help would be much appreciated.

Embedding Source Code into an Add-in

Hi all, I would like to integrate an AddIn in my geotab service, however I have no idea where to start, I mean, I have another integration but in this case I don't know how to start, the first question is related to the environment, I was wondering if I could do this in the mypreview test environment or directly in the productive environment.

How to develop Geotab Add-Ins and where to implement them

Is there any example of MyGeotab addin API showing truck position on a map?

I wants to get selected vehicle weight.@EishiFUN​  Can you please help me into this ?Thanks in advance!